import Taro, { Component } from '@tarojs/taro'
import { View, Image } from '@tarojs/components'

import StarScore from '../star-score'

import './index.less'

type ICommentCellProps = {
  showLine: boolean
}

export default class CommentCell extends Component<ICommentCellProps, {}> {

  static defaultProps = {
    showLine: true
  }

  render () {
    const { showLine } = this.props
    return (
      <View className={`container ${showLine ? 'border-bottom_1px' : ''}`}>
        <View className='header'>
          <View className='left'>
            <Image src='' className='icon' lazyLoad mode='aspectFill' />
          </View>
          <View className='right'>
            <View className='title'>长泰广场店</View>
            <View className='sub-title'>2017-09-08 17：30</View>
          </View>
        </View>
        <View className='center-content'>
          质量非常不错，希望下次可以再来；质量非常不错，希望下次可以再来；质量非常不错，希望下次可以再来；质量非常不错，希望下次可以再来；质量非常不错，希望下次可以再来；质量非常不错，希望下次可以再来。
        </View>
        <View className='synthesize-content'>
          <View className='synthesize-item'>
            <View className='title'>商品描述</View>
            <StarScore
              sd-class='star-score'
              score={3}
              itemWH={30}
              spacePadding={2}
            />
          </View>

          <View className='synthesize-item'>
            <View className='title'>服务评价</View>
            <StarScore
              sd-class='star-score'
              score={4}
              itemWH={30}
              spacePadding={2}
            />
          </View>

          <View className='synthesize-item'>
            <View className='title'>物流评价</View>
            <StarScore
              sd-class='star-score'
              score={4}
              itemWH={30}
              spacePadding={2}
            />
          </View>
        </View>

        <View className='pic-content'>
          <View className='pic-list'>
            {
              [1,2,3,4,5].map((_, index) => {
                return <Image src='' mode='aspectFill' lazyLoad className='pic-item' key={index}/>
              })
            }
          </View>
        </View>
        <View className='platform-content'>
          <View className='platform-arrow'></View>
          <View className='body-content'>
            <View className='data-content'>
              <View className='inner'>平台回复：感谢您的支持，我们会为您提供最满意 的服务，感谢您的惠顾。</View>
            </View>
          </View>
        </View>
        <View style='height:60rpx;'></View>
      </View>
    )
  }
}
